<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人博客</title>
    <link rel="stylesheet" href="./css/index.css">
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.1/css/bootstrap.css" rel="stylesheet"
        crossorigin="anonymous">
</head>

<body>
    <!-- 顶部导航栏 -->
    <div class="top">
        <div class="logo">蒙 面 大 婶</div>
        <nav class="nav nav-justified">
            <a class="nav-link active" aria-current="page" href="./index.html">Home</a>
            <a class="nav-link" href="./article.html">Article</a>
            <a class="nav-link" href="./tags.html">Tags</a>
        </nav>
    </div>
    <!-- 背景 -->
    <div class="bg">
        <h1 class="text">欢迎来到蒙面大婶的博客！</h1>
        <div class="arrow"><a href="#tiao">V</a></div>
    </div>
    <!-- 主页 -->
    <div class="home_page w">
        <!-- 左侧用户信息  -->
        <div class="left" id="tiao">
            <!-- 用户头像等信息 -->
            <div class="left_user">
                <div class="user_avatar">
                    <img src="" alt="">
                </div>
                <div class="user_name"></div>
                <div class="number">
                    <div class="article">
                        <div>Article</div>
                        <div>10</div>
                    </div>
                    <div class="tags">
                        <div>Article</div>
                        <div class="four"></div>
                    </div>
                </div>
                <div class="add">
                    <img src="./img/iconfont/shuqian.png" alt="">
                    <span>&nbsp; Add To Bookmark</span>
                </div>
            </div>
            <!-- 标签 -->
            <div class="left_tags">
                <div class="tags">
                    <img src="./img/iconfont/biaoqians.png" alt="">
                    Tags
                </div>
                <div class="js">
                    <a href="./tags.html" class="one">demo</a>
                    <a href="./tags.html" class="two">JavaScript</a>
                </div>
            </div>
            <!-- 日期 -->
            <div class="left_archives">
                <div class="tags">
                    <img src="./img/iconfont/biaoqians.png" alt="">
                    Archives
                </div>
                <div class="date">
                    <a href="./article.html">2021/03</a>
                    <a href="./article.html">2020/12</a>
                    <a href="./article.html">2020/12</a>
                </div>
                <a href="#">More</a>
            </div>
        </div>
        <!-- 右侧所有文章 -->
        <div class="article_all">
            <ul class="ul">
                <!-- <li class="article">
                    <div class="img">
                        <img src="./img/05.jpg" alt="">
                    </div>
                    <div class="content">
                        <div class="title">JS中的预编译</div>
                        <div class="date">
                            <img src="./img/iconfont/rili.png" alt="">
                            2021
                        </div>
                        <div class="text">aaa</div>
                    </div>
                </li> -->
            </ul>
        </div>
    </div>
    <!-- 链接外部JS -->
    <script src="./bootstrap.bundle.js" crossorigin="anonymous"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.7.1/jquery.js"></script>
    <script src="./js/index.js"></script>
</body>

</html>